
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<%--
  Created by IntelliJ IDEA.
  User: jerry
  Date: 15/1/31
  Time: 下午4:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<head>


    <jsp:include page="/pages/include/includeCSS.jsp" ></jsp:include>
    <script src="${pageContext.request.contextPath}/pages/assets/js/jquery-1.11.1.min.js"></script>
    <title>customer list page</title>
</head>
<body class="page-body">

<div class="page-loading-overlay">
    <div class="loader-2"></div>
</div>

<jsp:include page="/pages/admin/include/head_Settings-Pane.jsp"></jsp:include>
<jsp:include page="/pages/admin/include/leftPane.jsp"></jsp:include>

<jsp:include page="/pages/admin/include/includeHeadBar.jsp"></jsp:include>


<div class="page-title">

    <div class="title-env">
        <h1 class="title">客户管理</h1>
        <p class="description"> 客户列表页 </p>
    </div>

    <div class="breadcrumb-env">

        <ol class="breadcrumb bc-1">
            <li>
                <a href="${pageContext.request.contextPath}"><i class="fa-home"></i>首页</a>
            </li>

            <li class="active">

                <strong><i class="fa-list"></i>客户信息</strong>
            </li>
        </ol>

    </div>

</div>


<tr>

    <td>
        <a href="javascript:;" onclick="jQuery('#modal-6').modal('show', {backdrop: 'static'});" class="btn btn-primary btn-single btn-sm">添加客户</a>
    </td>

    <td>
        <a href="javascript:;" onclick="jQuery('#modal-6').modal('show', {backdrop: 'static'});" class="btn btn-primary btn-single btn-sm">批量导入</a>
    </td>

    <td>
        <a href="javascript:;" onclick="jQuery('#modal-6').modal('show', {backdrop: 'static'});" class="btn btn-primary btn-single btn-sm">批量导出</a>
    </td>
</tr>

<!-- customer view list context -->

<!-- Basic Setup -->
<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">客户信息列表</h3>

        <div class="panel-options">
            <a href="#" data-toggle="panel">
                <span class="collapse-icon">&ndash;</span>
                <span class="expand-icon">+</span>
            </a>
            <a href="#" data-toggle="remove">
                &times;
            </a>
        </div>
    </div>
    <div class="panel-body">

        <script type="text/javascript">
            jQuery(document).ready(function($)
            {
                $("#customeTable").dataTable({
                    aLengthMenu: [
                        [10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]
                    ]
                });
            });
        </script>

        <table id="customeTable" class="table table-striped table-bordered" cellspacing="0" width="100%">
            <thead>
            <tr>

                <th>姓名</th>
                <th>电话</th>
                <th>来访时间</th>
                <th>所属项目</th>
                <th>职业顾问</th>
                <th>客户来源</th>
                <th>状态</th>
                <th>详情</th>
                <th>操作纪录</th>

            </tr>
            </thead>



            <tbody>

            <tr>
            <c:forEach var="customerList" items="${customerList}">

                <td>
                ${customerList.customerName}
                </td>
                <td>${customerList.cellphone1}</td>
                <td>
                        ${customerList.respectsTime}
                </td>
                <td>
                        ${customerList.purchaseReasons}
                </td>
                <td>
                        ${customerList.age}
                </td>
                <td>
                        ${customerList.customerPlay}
                </td>
                <td>
                        <button class="btn-success" >状态</button>
                </td>
                <td>
                        <button class="btn-link" >详情</button>
                </td>
                <td>
                        <button class="btn-gray">记录</button>
                </td>


            </tr>
            </c:forEach>



            </tbody>
        </table>

    </div>
</div>



<jsp:include page="/pages/admin/include/includeFooter.jsp"></jsp:include>



<!-- Modal 6 (Long Modal)-->
<div class="modal fade" id="modal-6">
    <div class="modal-dialog">
        <div class="modal-content">

            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">添加客户</h4>
            </div>

            <div class="modal-body">

                <div class="row">
                    <div class="col-md-6">

                        <div class="form-group">
                            <label for="field-1" class="control-label">姓名</label>

                            <input type="text" class="form-control" id="field-1" placeholder="张三">
                        </div>

                    </div>

                    <div class="col-md-6">

                        <div class="form-group">
                            <label for="field-2" class="control-label">联系电话</label>

                            <input type="text" class="form-control" id="field-2" placeholder="137XXXXXXX">
                        </div>

                    </div>
                </div>

                <div class="row">
                    <div class="col-md-12">

                        <div class="form-group">
                            <label for="field-3" class="control-label">住址</label>

                            <input type="text" class="form-control" id="field-3" placeholder="西昌市航天大道XXX">
                        </div>

                    </div>
                </div>

                <div class="row">
                    <div class="col-md-4">

                        <div class="form-group">
                            <label for="field-4" class="control-label">年龄</label>

                            <input type="text" class="form-control" id="field-4" placeholder="">
                        </div>

                    </div>

                    <div class="col-md-4">

                        <div class="form-group">
                            <label for="field-5" class="control-label">工作</label>

                            <input type="text" class="form-control" id="field-5" placeholder="程序员">
                        </div>

                    </div>

                    <div class="col-md-4">

                        <div class="form-group">
                            <label for="field-6" class="control-label">来访时间</label>

                            <input type="text" class="form-control" id="field-6" placeholder="自动生成或者手动生成？">
                        </div>

                    </div>
                </div>

                <div class="row">
                    <div class="col-md-12">

                        <div class="form-group no-margin">
                            <label for="field-7" class="control-label">客户备注</label>

                            <textarea class="form-control autogrow" id="field-7" placeholder="此客户有望购买。。。。。。"></textarea>
                        </div>

                    </div>
                </div>

            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-info">添加</button>
            </div>
        </div>
    </div>
</div>


<!-- Imported styles on this page -->
<link rel="stylesheet" href="${pageContext.request.contextPath}/pages/assets/js/datatables/dataTables.bootstrap.css">

<!-- Bottom Scripts -->
<script src="${pageContext.request.contextPath}/pages/assets/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/pages/assets/js/TweenMax.min.js"></script>
<script src="${pageContext.request.contextPath}/pages/assets/js/resizeable.js"></script>
<script src="${pageContext.request.contextPath}/pages/assets/js/joinable.js"></script>
<script src="${pageContext.request.contextPath}/pages/assets/js/xenon-api.js"></script>
<script src="${pageContext.request.contextPath}/pages/assets/js/xenon-toggles.js"></script>
<script src="${pageContext.request.contextPath}/pages/assets/js/datatables/js/jquery.dataTables.min.js"></script>


<!-- Imported scripts on this page -->
<script src="${pageContext.request.contextPath}/pages/assets/js/datatables/dataTables.bootstrap.js"></script>
<script src="${pageContext.request.contextPath}/pages/assets/js/datatables/yadcf/jquery.dataTables.yadcf.js"></script>
<script src="${pageContext.request.contextPath}/pages/assets/js/datatables/tabletools/dataTables.tableTools.min.js"></script>


<!-- JavaScripts initializations and stuff -->
<script src="${pageContext.request.contextPath}/pages/assets/js/xenon-custom.js"></script>

</body>
</html>
